import {computed, ref} from 'vue'

export enum FieldType {
    TEXT = 'text',
    TEXTAREA = 'textarea',
    NUMBER = 'number',
    RADIO = 'radio',
    CHECKBOX = 'checkbox',
    SELECT = 'select',
    DATEPICKER = "datepicker",
}

export const fieldList = [
    {
        id: FieldType.TEXT,
        text: '单行文本框'
    },
    {
        id: FieldType.TEXTAREA,
        text: '多行文本框'
    },
    {
        id: FieldType.NUMBER,
        text: '数字输入框'
    },
    {
        id: FieldType.RADIO,
        text: '单选框'
    },
    {
        id: FieldType.CHECKBOX,
        text: '多选框'
    },
    {
        id: FieldType.SELECT,
        text: '下拉选择框',
        props: {
            optionType: 'custom',
            options:[]
        }
    },
    {
        id: FieldType.DATEPICKER,
        text: '日期选择框',
        props: {
            type: 'date'
        }
    },
]

const currentFieldType = ref<string>('')
const currentFieldProps = ref({})

export function useField() {
    function setFieldType(type: string) {
        currentFieldType.value = type
    }

    function setFieldProps(props) {
        currentFieldProps.value = props
    }

    const getFieldType = computed(() => currentFieldType.value)
    const getFieldProps = computed(() => currentFieldProps.value)

    return {setFieldProps, setFieldType, getFieldProps, getFieldType}
}
